﻿@using Eksponent.RazorRocks.Umbraco
@using umbraco.MacroEngines
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<title>@RazorRocks.CurrentNode.GetProperty("title")</title>    
</head>
<body>   
    <div style="float: left; width: 300px;">        
        Menu:
        <div>The menu items rendered using the templates matching the document types in macroScripts/RazorRocks/Menu</div>
        <ul>
            @foreach (var mainItem in new DynamicNode(1050).GetChildrenAsList.Items)
            {
                @mainItem.Render("Menu")
            }
        </ul>
    </div>    

    <div style="height: 1%; overflow: hidden;">

    <div style="margin: 20px 0"><b>Backoffice login: admin / 1234</b></div>

    <div>The main content uses the template matching the document type in macroScripts/RazorRocks/Menu</div>            
    @RenderBody() 
           

    <div>You can configure which templates to use for which document types in macroScripts/Dispatch.cshtml.</div>
    <div>For example "Frontpage.cshtml" is used for the document type "Site". </div>
    <div>"Default.cshtml" is used for all other types. If you create "NewsItem.cshtml" it will be used for all news items</div>

    <h2>Reusable components</h2>
    <div>Something pageable</div>

    @{var someData = new Components.PageableWrapper<int>(
          Enumerable.Range(1, 10000));
          
      @Components.Pageable.Write(someData, @<div>
        @PageBar(@item)
        <ul>
            @foreach( var node in item.Items ) {
                <li>@node</li>
            }
        </ul>
        @PageBar(@item)
      </div>)
    }
    </div>
</body>
</html>

@helper PageBar(Components.Pageable.ViewModel<int> model)
{
    <style>.pager a.selected {font-weight: bold; }</style>
    <div class="pager">                    
        @if( model.PrevUrl != null ) {
            <a href="@model.PrevUrl">Previous</a>
        }
        
        @foreach( var page in model.Pages ) {
            if( page.Url == null ) {
                <span>@page.Text</span>
            } else {
                <a href="@page.Url" class="@(page.Selected ? "selected" : "")">                    
                    @page.Text                    
                </a>
            }
        }

        @if( model.NextUrl != null ) {
            <a href="@model.NextUrl">Next</a>
        }
    </div>
}